import React,{Component} from 'react';
import { Carousel } from 'antd';
import img_url from './imgUrl';
import './slideBanner.less';
const prefix = "carousel";
class SlideBanner extends Component{
    render(){
        let imgEle = img_url.map((value,index)=>{
           return(
               <div key={index} className={prefix+"-slide"}>
                   <a href={value.link} style={{background:`url(${value.img}) no-repeat center`,backgroundSize:"cover"}}>
                   </a>
               </div>
           )
        });
        let setting = {
            autoplay:true,
            autoplaySpeed:2500,
            dots:true,
            fade:true,
            dotsClass:`slick-dots ${prefix}-dots`
        }
        return(
            <Carousel className={prefix} {...setting}>
                {imgEle}
            </Carousel>
        )
    }
};
export default SlideBanner;